html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
vertical-align: baseline;
background: transparent;
text-decoration:none;
list-style:none;
/*font: 12px/21px "microsoft yahei";*/
}
ol, ul, li, dl, dt, dd {
    list-style: none;
}
a{
  color: #f19833;
}
.clearfix{*zoom:1;}
.clearfix:before,.clearfix:after{display:table;content:"";line-height:0;}
.clearfix:after{clear:both;}

.tc{text-align: center;}
.pos-r{position: relative;}
.pos-a{position: absolute;}

.section-1{
  margin-top: 11px;
  margin-bottom: -11px;
  width: 100%;
  height: 600px;
  background: url(../images/section-1.jpg) center;
  background-size: cover;
}
.section-1 .btn-area{
  position: absolute;
  width: 100%;
  bottom: 50px;
  font-size: 28px;
}
.section-2{
  width: 100%;
  height: 600px;
  background: url(../images/section-2.jpg) center;
  background-size: cover;
  position: relative;
}
.section-2:after{
  position: absolute;
  content: " ";
  height: 100%;
  width: 100%;
  background-color:rgba(0,0,0,0.4);
  z-index:2;
}
.section-2 .text-area{
  position: absolute;
  top: 100px;
  width: 100%;
  color: #fff;
  font-size: 20px;
  text-align: center;
  z-index:3;
}
.section-2 .text-area p{
  padding: 10px 0px;
}
.section-2 .btn-area{
  position: absolute;
  width: 100%;
  font-size: 20px;
  text-align: center;
  z-index:3;
  bottom: 80px;
}
.section-2 .btn-area .fun-learn-more{
  margin-top: 20px;
  font-size: 30px;
  position: absolute;
}
.section-2 .btn-area .fa-minus-circle{
  -webkit-transform: translateY(70px);
  transform: translateY(70px);
  -webkit-transition: all .5s;
  transition: all .5s;
}
.section-2-more{
  display: none;
  width: 100%;
  background-color: red;
  color: #fff;
  text-align: center;
  line-height: 200px;
}
.section-3 section{
  background:url(../images/bg1.png) center;
  background-size: cover;
  width: 100%;
  height: 600px;
  padding-top: 120px;
  position: relative;
}
.section-3 section .image,.section-3 section .text{
  position: absolute;
}
.section-3 section .text{
  margin-top: 100px;
  width: 40%;
}
.section-3 section .image{
  width: 50%;
}
.section-3 section .image img{
  width: 100%;
}
.section-3 section.left .text{
  left: 60%;
}
.section-3 section.right .text{
  left: 10%;
}
.section-3 section.right .image{
  right: 0px;
}
.section-3 section .text .title{
  font-size: 40px;
  color: #f19833;
}
.section-3 section .text .price{
  font-size: 23px;
  line-height: 2;
  color: #333;
}
.section-3 section .text .line{
  border-top: 1px solid #f19833;
  width: 1px;
  margin-bottom: 40px;
}
.section-3 section .text .descrition{
  color: #555;
  font-size: 18px;
  line-height: 1.5;
  width: 80%;
}
.section-3 section .text .btn-detail{
  float: left;
  margin-top: 20px;
  border: 1px solid #f19833;
  color: #555;
  font-size: 16px;
  padding: 8px 30px;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.section-3 section .text .btn-detail:hover{
  background-color: #f19833;
  color: #fff;
}

.section-4{
  width: 100%;
  height: 600px;
  background: url(../images/section-4.jpg) center;
  background-size: cover;
  position: relative;
}
.section-4:after{
  position: absolute;
  content: " ";
  height: 100%;
  width: 100%;
  background-color:rgba(0,0,0,0.4);
  z-index:2;
}
.section-4 .text-area{
  position: absolute;
  top: 100px;
  width: 100%;
  color: #fff;
  font-size: 20px;
  text-align: center;
  z-index:3;
}
.section-4 .text-area .title{
  color: #f19833;
  font-size: 50px;
  line-height: 2;
  padding: 10px 0px;
}
.section-4 .text-area .descrition{
  font-size: 20px;
  line-height: 2;
}
.section-4 .btn-area{
  position: absolute;
  width: 100%;
  font-size: 20px;
  text-align: center;
  z-index:3;
  bottom: 80px;
}
.section-4 .btn-area a{
  border: 1px solid #f19833;
  color: #555;
  font-size: 16px;
  padding: 8px 30px;
  color: #fff;
  -webkit-transition: all .5s;
  transition: all .5s;
}
.section-4 .btn-area a:hover{
  background-color: #f19833;
  color: #fff;
}
.fadeinup{
  -webkit-animation: fadeinup 2s both;
  -moz-animation: fadeinup 2s both;
  -ms-animation: fadeinup 2s both;
  animation: fadeinup 2s both;
}
.start-animate .slideup-1{
  -webkit-animation: slideup 1s both;
  -moz-animation: slideup 1s both;
  -ms-animation: slideup 1s both;
  animation: slideup 1s both;
}
.start-animate .slideup-2{
  -webkit-animation: slideup 1.5s both;
  -moz-animation: slideup 1.5s both;
  -ms-animation: slideup 1.5s both;
  animation: slideup 1.5s both;
}
.start-animate .slideup-3{
  -webkit-animation: slideup 2s both;
  -moz-animation: slideup 2s both;
  -ms-animation: slideup 2s both;
  animation: slideup 2s both;
}
.start-animate .slideup-4{
  -webkit-animation: slideup 2.5s both;
  -moz-animation: slideup 2.5s both;
  -ms-animation: slideup 2.5s both;
  animation: slideup 2.5s both;
}
.start-animate .widthup{
  -webkit-animation: widthup 2s both;
  -moz-animation: widthup 2s both;
  -ms-animation: widthup 2s both;
  animation: widthup 2s both;
}
@keyframes fadeinup{
  0%{
    opacity: 0;
    -webkit-transform:translate(0,0);
    transform:translate(0,0);
  }
  100%{
    opacity: 1;
    -webkit-transform:translate(0,-11px);
    transform:translate(0,-11px);
  }
}
@keyframes slideup{
  0%{
    -webkit-transform:translate(0,0);
    transform:translate(0,0);
  }
  100%{
    -webkit-transform:translate(0,-100px);
    transform:translate(0,-100px);
  }
}
@keyframes widthup{
  0%{
    width: 30px;
  }
  100%{
    -webkit-transform:translate(0,-80px);
    transform:translate(0,-80px);
    width: 100px;
  }
}

@-webkit-keyframes fadeinup{
  0%{
    opacity: 0;
    -webkit-transform:translate(0,0);
    transform:translate(0,0);
  }
  100%{
    opacity: 1;
    -webkit-transform:translate(0,-11px);
    transform:translate(0,-11px);
  }
}
@-webkit-keyframes slideup{
  0%{
    -webkit-transform:translate(0,0);
    transform:translate(0,0);
  }
  100%{
    -webkit-transform:translate(0,-100px);
    transform:translate(0,-100px);
  }
}
@-webkit-keyframes widthup{
  0%{
    width: 30px;
  }
  100%{
    -webkit-transform:translate(0,-80px);
    transform:translate(0,-80px);
    width: 100px;
  }
}

